<template>
  <!-- #ifndef MP-TOUTIAO -->
  <back-nav-bar title="关于我们"></back-nav-bar>
  <!-- #endif -->
  <view class="about-container">
    <!-- 内容区 -->
    <view class="content">
      <text class="description">欢迎来到我们的应用！我们致力于为您提供最好的服务体验。</text>
      <text class="description">如果您有任何问题或建议，请随时联系我们。</text>
    </view>
  </view>
</template>

<script setup lang="ts">
import BackNavBar from '@/components/back-nav-bar/back-nav-bar.vue'
</script>

<style scoped lang="scss">
.about-container {
  background-color: #f5f5f5;
  padding: 20rpx;

  .header {
    background-color: #fff;
    padding: 40rpx;
    text-align: center;
    margin-bottom: 20rpx;
    border-radius: 8rpx;
    box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);

    .title {
      font-size: 36rpx;
      color: #333;
      font-weight: bold;
    }
  }

  .content {
    background-color: #fff;
    padding: 20rpx;
    border-radius: 8rpx;
    box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);
    margin-bottom: 20rpx;

    .description {
      font-size: 28rpx;
      color: #666;
      line-height: 1.6;
      margin-bottom: 10rpx;
    }
  }
}
</style>
